<template>
<div> 
  <v-layout row class="v-layout">
    <v-flex xs12 sm6 offset-sm3>
      <v-card>
        <v-card-media 
          height="60px"
        >
          <v-container fill-height fluid>
            <v-layout fill-heigh>
              <v-flex xs12 align-end flexbox>
                <span class="headline">信息技术系</span>
                <v-btn small class="green lighten-3">修改</v-btn>
                <v-btn small class="red lighten-3">删除</v-btn>
              </v-flex>
            </v-layout>
          </v-container>
        </v-card-media>

        <v-list two-line>
          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">phone</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>(650) 555-1234</v-list-tile-title>
            </v-list-tile-content>

            
          </v-list-tile>

          

          <v-divider inset></v-divider>

          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">mail</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>aliconnors@example.com</v-list-tile-title>
            </v-list-tile-content>
          </v-list-tile>

          

          <v-divider inset></v-divider>

          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">location_on</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>1400 Main Street</v-list-tile-title>
              <v-list-tile-sub-title>Orlando, FL 79938</v-list-tile-sub-title>
            </v-list-tile-content>
          </v-list-tile>
        </v-list>
      </v-card>
    </v-flex>
  </v-layout>

  <v-layout row>
    <v-flex xs12 sm6 offset-sm3>
      <v-card>
        <v-card-media 
          height="50px"
        >
          <v-container fill-height fluid>
            <v-layout fill-height>
              <v-flex xs12 align-end flexbox>
                <span class="headline">电气工程系</span>
              </v-flex>
            </v-layout>
          </v-container>
        </v-card-media>

        <v-list two-line>
          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">phone</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>(650) 555-1234</v-list-tile-title>
            </v-list-tile-content>

            
          </v-list-tile>

          

          <v-divider inset></v-divider>

          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">mail</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>aliconnors@example.com</v-list-tile-title>
            </v-list-tile-content>
          </v-list-tile>

          

          <v-divider inset></v-divider>

          <v-list-tile @click="ok">
            <v-list-tile-action>
              <v-icon color="indigo">location_on</v-icon>
            </v-list-tile-action>

            <v-list-tile-content>
              <v-list-tile-title>1400 Main Street</v-list-tile-title>
              <v-list-tile-sub-title>Orlando, FL 79938</v-list-tile-sub-title>
            </v-list-tile-content>
          </v-list-tile>
        </v-list>
      </v-card>
    </v-flex>
  </v-layout>
  <v-btn
      fab
      bottom
      right
      color="teal"
      dark
      fixed
    >
      <v-icon>add</v-icon>
    </v-btn>
</div>
</template>

<script>
export default {

    methods: {
        ok(){}
    }
    
}
</script>

<style>
.v-layout{
    margin-bottom: 30px;
}
</style>

